<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1" />
		<link rel="icon" type="image/x-icon" href="images/icon.ico" mce_href="images/icon.ico"/>
		<link href='http://fonts.googleapis.com/css?family=Khula ' rel='stylesheet' type='text/css'>
		<link href='http://fonts.googleapis.com/css?family=Permanent+Marker |Khula' rel='stylesheet' type='text/css'>
		<link rel="stylesheet" href="css/estilo.css">
		<link rel="stylesheet" href="css/menu.css">
		<title>índice</title>
	</head>
	<body>
	<header>
		
	
		<nav>
			<a href="#" class="logo">DeRuta</a>
			<input type="checkbox" id="nav" /><label for="nav"></label>
			<ul>
		        <li><a href="index.html">Inicio</a></li>       
		        <li>
		          <a href="pages/login.html">Login</a>
		          
		        </li>
		        <li><a href="pages/rutas.html">Rutas</a>
		        	<!--<ul>
		            <li><a href="#"><input type="text"></input><a href="">Go</a></a></li>
		                 
		          </ul>-->
		        </li>
		          
		        <li><a href="nueva_ruta.html">Alta ruta</a></li>
		        <li><a href="pages/registro.html">Registro</a></li>

	      	</ul>



			
		</nav>
	</header>
	<article>
		<figure class="pic">
			<img src="images/borosa.jpg" alt="">
			<h2>Monasterio de la Piedra</h2>
			<figcaption class="back">
				<p>Fecha</p>
				<p>Distancia</p>
				<p>Dificultad</p>
				<p>Numero de fotos</p>
				<p>Comentarios</p>
			</figcaption>
		</figure>

		<figure class="pic">
			<img src="images/borosa.jpg" alt="">
			<h2>Monasterio de la Piedra</h2>
			<figcaption class="back">
				<p>Fecha</p>
				<p>Distancia</p>
				<p>Dificultad</p>
				<p>Numero de fotos</p>
				<p>Comentarios</p>
			</figcaption>
		</figure>

		<figure class="pic">
			<img src="images/borosa.jpg" alt="">
			<h2>Monasterio de la Piedra</h2>
			<figcaption class="back">
				<p>Fecha</p>
				<p>Distancia</p>
				<p>Dificultad</p>
				<p>Numero de fotos</p>
				<p>Comentarios</p>
			</figcaption>
		</figure>

		<figure class="pic">
			<img src="images/borosa.jpg" alt="">
			<h2>Monasterio de la Piedra</h2>
			<figcaption class="back">
				<p>Fecha</p>
				<p>Distancia</p>
				<p>Dificultad</p>
				<p>Numero de fotos</p>
				<p>Comentarios</p>
			</figcaption>
		</figure>

		<figure class="pic">
			<img src="images/borosa.jpg" alt="">
			<h2>Monasterio de la Piedra</h2>
			<figcaption class="back">
				<p>Fecha</p>
				<p>Distancia</p>
				<p>Dificultad</p>
				<p>Numero de fotos</p>
				<p>Comentarios</p>
			</figcaption>
		</figure>

		<figure class="pic">
			<img src="images/borosa.jpg" alt="">
			<h2>Monasterio de la Piedra</h2>
			<figcaption class="back">
				<p>Fecha</p>
				<p>Distancia</p>
				<p>Dificultad</p>
				<p>Numero de fotos</p>
				<p>Comentarios</p>
			</figcaption>
		</figure>

		<figure class="pic">
			<img src="images/borosa.jpg" alt="">
			<h2>Monasterio de la Piedra</h2>
			<figcaption class="back">
				<p>Fecha</p>
				<p>Distancia</p>
				<p>Dificultad</p>
				<p>Numero de fotos</p>
				<p>Comentarios</p>
			</figcaption>
		</figure>	
	</article>
	

	<footer>
		<ul>
			<li><a href="pages/acerca.html"><span>Acerca de</span></a></li>
			<li><a href="#"><span>Términos de servicio</span></a></li>
			<li><a href="#"><span>Política de privacidad</span></a></li>
			<li><span>Pablo López Mansilla y Marta Guerrero Pastor</span></li>
			<li><span>Febrero 2015</span></li>
		</ul>
	</footer>
	
	</body>
</html>